<!-- 联系人控件 -->
<template>
  <a-space direction="vertical" style="width: 100%">
    <a-select
      :style="{ width: '160px' }"
      v-model="buyer"
      :disabled="props.disabled"
      @change="UserChange"
    >
      <a-option v-for="item in userData" :key="item.id" :value="item.id">{{
        item.name
      }}</a-option>
    </a-select>
  </a-space>
</template>

<script lang="ts" setup>
  import { ref, computed, watch, onMounted } from 'vue';
  import { GetPersonnelinformation } from '@/api/home/System settings/personal-information/index';
  import miiter from '@/utils/mitt';

  const props = withDefaults(
    defineProps<{
      props: { [propName: string]: any };
      name?: string;
      required?: boolean;
      oneValue: any;
      disabled: boolean;
      regex?: {
        [name: string]: {
          role: any;
          name: any;
        };
      };
    }>(),
    {}
  );

  const emit = defineEmits(['update:oneValue']);

  const buyer = computed({
    get: () => {
      return props.oneValue;
    },
    set: (val) => {
      emit('update:oneValue', val);
    },
  });

  const userData = ref();

  const GetPersonnelInfo = async () => {
    const res = await GetPersonnelinformation({ page: 0, size: 9999 });
    userData.value = res.content.data;
  };
  GetPersonnelInfo();

  const UserChange = (key: number) => {
    emit('update:oneValue', key);
    const assignInfo = userData.value.filter((i) => i.id === key);
    miiter.emit('buyerInfo', { data: assignInfo });
  };
</script>

<style scoped lang="less"></style>
